<template>
  <div class="preview-popup">
    <iframe :src="src" width="100%" height="100%" style="border:0px;" />
  </div>
</template>

<script>
export default {
  name: 'preview-popup',
  props: {
    id: {
      type: [ String, Number ],
      default: ''
    }
  },
  computed: {
    src() {
      const { id } = this
      if(process.env.NODE_ENV.indexOf("prod")!=-1){
        return `/ad/preview.html#/view/${id}`
      }else{
        return `/preview.html#/view/${id}`
      }

    }
  }
}
</script>

<style lang="scss" scoped>
.preview-popup {
  width: 100%;
  height: 100%;
}
.page-editor {
  .el-dialog {
    position: relative !important;
    height: 50% !important;
    .el-dialog__body {
      height: 50% !important;
      overflow: auto !important;
    }
    .el-dialog__header{
      display: none;
    }
  }
}
</style>
